window.addEventListener('load', function () {
    // 1.赛事详情页头部部分
    // 点击战队数据和选手数据改变类
    var detail_nav = document.querySelector('.detail-nav')
    var data_style = detail_nav.querySelector('.data-style')
    var detail_nav_click = data_style.querySelectorAll('a')

    for (var i = 0; i < detail_nav_click.length; i++) {
        detail_nav_click[i].addEventListener('click', function () {
            for (var i = 0; i < detail_nav_click.length; i++) {
                detail_nav_click[i].className = ''
            }
            this.className = 'detail-nav-click'
        })
    }


    // 2.赛事详情页上半部分
    // (1) 头部按钮切换
    var detail_list = document.querySelector('.detail-list')
    var detail_list_title = detail_list.querySelector('.detail-list-title')
    var detail_title_click = detail_list_title.querySelectorAll('div')
    var detail_delta = detail_list.querySelectorAll('.detail-delta')
    var eff_list = detail_list.querySelector('.eff-list')
    var res_list = detail_list.querySelector('.res-list')

    var detail_deltaArr = Array.prototype.slice.call(detail_delta)
    var eff = detail_deltaArr.slice(0, 9)
    var res = detail_deltaArr.slice(9, 18)

    for (var i = 0; i < detail_title_click.length; i++) {
        detail_title_click[i].addEventListener('click', function () {
            for (var i = 0; i < detail_title_click.length; i++) {
                detail_title_click[i].className = 'detail-rank'
            }
            this.className = 'detail-rank detail-title-click'
        })
    }
    // 头部按钮切换 控制表头切换
    detail_title_click[0].addEventListener('click', function () {
        for (var i = 0; i < eff.length; i++) {
            eff[i].style.display = 'table-cell'
            res[i].style.display = 'none'
        }
        eff_list.style.display = 'table-row-group'
        res_list.style.display = 'none'
    })
    detail_title_click[1].addEventListener('click', function () {
        for (var i = 0; i < res.length; i++) {
            eff[i].style.display = 'none'
            res[i].style.display = 'table-cell'
        }
        eff_list.style.display = 'none'
        res_list.style.display = 'table-row-group'
    })
    // 战队搜索模块显示隐藏 
    var detail_shalou = detail_list.querySelector('.detail-shalou')
    var detail_rank_menu = detail_list.querySelector('.detail-rank-menu')
    var detail_btn_close = detail_rank_menu.querySelector('.detail-btn-close')
    detail_shalou.addEventListener('click', function () {
        if (detail_rank_menu.style.display === 'none') {
            detail_rank_menu.style.display = 'block'
        } else {
            detail_rank_menu.style.display = 'none'
        }
    })
    //  点击取消 隐藏战队搜索模块
    detail_btn_close.addEventListener('click', function () {
        detail_rank_menu.style.display = 'none'
    })
    //  所有战队按钮勾选
    var detail_choose = detail_list.querySelector('.detail-choose')
    var choose_succse = detail_choose.querySelector('.choose-succse')

    detail_choose.addEventListener('click', function () {
        if (choose_succse.style.display === 'none') {
            choose_succse.style.display = 'inline-block'
        } else {
            choose_succse.style.display = 'none'
        }
    })
    // (2)详情页数据表格
    // 鼠标经过表格的行,改变当前行的背景颜色
    var eff_trs = eff_list.querySelectorAll('tr')
    var res_trs = res_list.querySelectorAll('tr')

    eff_trsArr = Array.prototype.slice.call(eff_trs)
    res_trsArr = Array.prototype.slice.call(res_trs)

    for (var i = 0; i < eff_trsArr.length; i++) {
        eff_trsArr[i].addEventListener('mouseover', function () {
            this.style.backgroundColor = '#e6e6e6'
            this.style.borderTop = '1px solid #8c8c8c'
            this.style.borderBottom = '1px solid #8c8c8c'
        })
        eff_trsArr[i].addEventListener('mouseout', function () {
            this.style.backgroundColor = '#fbfcfc'
            this.style.borderTop = ''
            this.style.borderBottom = '1px dashed #efefef'
        })
    }

    for (var i = 0; i < res_trsArr.length; i++) {
        res_trsArr[i].addEventListener('mouseover', function () {
            this.style.backgroundColor = '#e6e6e6'
            this.style.borderTop = '1px solid #8c8c8c'
            this.style.borderBottom = '1px solid #8c8c8c'
        })
        res_trsArr[i].addEventListener('mouseout', function () {
            this.style.backgroundColor = '#fbfcfc'
            this.style.borderTop = ''
            this.style.borderBottom = '1px dashed #efefef'
        })
    }

   
})
$(function () {
    // 页面滚动事件
    (function () {
        var boxTop = $('.content').offset().top
        $(window).scroll(function () {
            // 导航栏跟随页面
            if ($(window).scrollTop() >= boxTop) {
                $('.wraper-bg').css({
                    position: 'fixed',
                    top: 0
                })
            } else {
                $('.wraper-bg').css({
                    position: 'absolute',
                    top: '32px'
                })
            }

            // 回到顶部模块显示隐藏
            var boxH = $('tbody').height()
            if ($(window).scrollTop() >= boxH) {
                $('.xx_top').fadeIn()
            } else {
                $('.xx_top').fadeOut()
            }
        })
    })();
    // 点击回到顶部
    (function () {
        $('.xx_top').click(function () {
            $('body,html').stop().animate({
                scrollTop: 0
            })
        })
    })();
})